<template>
	<view class="app-container">
		<u-icon name="rmb-circle-fill" size="50" color="#FF9F0A"></u-icon>
		<view class="label-txt">今日活跃度余额</view>
		<view class="balance">
			<text>￥</text>
			<text class="money">{{balande}}</text>
		</view>
		<view class="link">
			<navigator url="/pages/income/income">
				<text  class="link-txt">查看明细</text>
			</navigator>
			<navigator url="/pages/balance/balance">
				<text  class="link-txt">查看账户余额</text>
			</navigator>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				balande:0,
			}
		},
		created() {
			this.getInfo()
		},
		methods: {
			getInfo(){
				this.$store.dispatch('user/getInfo').then(res => {
					let { activateCount } = res;
					this.balande = activateCount;
				});
			},
		}
	}
</script>

<style lang="scss">
	.app-container {
		padding: 20px;
		margin-top: 30px;
		display: flex;
		flex-direction: column;
		align-items: center;

		.label-txt {
			font-size: 15px;
			color: #8590a6;
			margin-top: 20px;
		}

		.balance {
			margin-top: 5px;
			display: flex;
			align-items: center;
			font-size: 24px;
			font-weight: bold;
			color: #000;

			.money {
				font-size: 36px;
				margin-left: 5px;
			}
		}
		.link{
			margin-top: 40px;
			text-align: center;
			
		}
		.link-txt {
			font-size: 15px;
			line-height: 40px;
			text-decoration: underline;
			margin-top: 50px;
			color: #1891d6;
		}
	}
</style>
